<template>
    <div class="lastMeetingQD-table-content">
        <div style="text-align: center;" >
            <h2 style="margin: 20px 0;color: #38f;font-weight: 600;">参会人员签到</h2>
        </div>
        
        <div class="inspector-table-from-d" >
            <div class="inspector-table-text" >
                <span class="table-text-s">人员类型</span>
                <span>：</span>
            </div>
            <div class="right-content-v">
                {{ hymx.frylx }}
                <span v-if="hymx.fjcsf">（{{ hymx.fjcsf }}）</span>
            </div>
        </div>
        <div class="inspector-table-from-d" >
            <div class="inspector-table-text">
                <span class="table-text-s" style="display: flex;justify-content: space-between;width: 72px;">
                    <span>姓</span>
                    <span>名</span>
                </span>
                <span>：</span>
            </div>
            <div class="right-content-v">
                {{ hymx.fxm }}
            </div>
        </div>
        <div style="text-align: center;margin-top: 40px;" >
            <a-button
                class="qd-btn"
                :key="btnKey"
                :class="hymx.fhyqdzt == '已签到'?'yqd-btn':''"
                type="primary" @click="submitTo()"
            >{{hymx.fhyqdzt == '已签到'? '已签到':'签到'}}</a-button>
        </div>
        <div style="text-align: center;margin-top: 10px;" v-if="hpState && hymx.frylx !== '观察员' && queryData.fhylx == '末次会议'">
            <a-button v-if="hpState == '待评价'" class="blue-btn1" type="primary" block @click="toEvaluateClick()">审评员评价</a-button>
            <span v-else style="color: #1ab394;font-size: 16px;font-weight: 600;" >已评价</span>
        </div>
    </div>
</template>
<script>
import { 
    spcySqsxXpjlhySubmit, spcySqsxXpjlqueryRcJxDbList,
} from './service/index'
function changeURLParam(url, paramName, newValue) {
    const urlParts = url.split('?');
    const baseUrl = urlParts.shift();
    let queryParams = {};
    
    if (urlParts.length > 0) {
        const paramPairs = urlParts[0].split('&');
        for (let i = 0; i < paramPairs.length; i++) {
            const pair = paramPairs[i].split('=');
            queryParams[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1] || '');
        }
    }

    queryParams[paramName] = newValue;
    let newUrl = baseUrl + '?';
    for (const key in queryParams) {
        if (newUrl.length > baseUrl.length + 1) {
            newUrl += '&';
        }
        newUrl += encodeURIComponent(key) + '=' + encodeURIComponent(queryParams[key]);
    }

    history.replaceState(null, null, newUrl);
}
export default {
    components:{

    },
    props:{

    },
    data(){
        return{
            queryData:{},
            hymx:{},
            btnKey:null,
            hpState:'',
        }
    },
    watch:{

    },
    mounted(){
        document.title = 'xx“技术审评”审评查验信息一体化智慧管理系统'
        this.queryData = JSON.parse(this.$route.query.obj)
        //console.log(this.queryData)
        this.hymx = this.queryData.hymx?this.queryData.hymx:{}
        this.getState()
    },
    methods:{
        getState(){
            let data = {
                sqsxid:this.queryData.sqsxid,
                fuserid:this.queryData.fuserid,
            }
            spcySqsxXpjlqueryRcJxDbList(data).then(res=>{
                if(res.code == 200){
                    this.hpState = res.result.hpState
                }else{
                    this.hpState = ''
                }
            })
        },
        submitTo(){
            if(this.hymx.fhyqdzt !== '已签到'){
                spcySqsxXpjlhySubmit({fhylx:this.queryData.fhylx,fuserid:this.queryData.fuserid,id:this.queryData.id,sqsxid:this.queryData.sqsxid,}).then(res=>{
                    if(res.code == 200){
                        const currentUrl = window.location.href;
                        this.queryData.hymx.fhyqdzt = '已签到'
                        changeURLParam(currentUrl, 'obj', JSON.stringify(this.queryData));
                        this.hymx.fhyqdzt = '已签到'
                        this.btnKey = Date.now()
                        this.$message.success(res.message)
                    }else{
                        this.$message.warning(res.message)
                    }
                })
            }
        },
        toEvaluateClick(){//去评价
            let data = {
                sqsxid:this.queryData.sqsxid,
                fuserid:this.queryData.fuserid,
            }
            window.location.href = bootConfig[process.env.NODE_ENV].EXTERNAL_ACCESS_URL+process.env.BASE_URL+ 'onSiteInspectionCheckInToEvaluate?obj='+JSON.stringify(data)
        },
    }
}
</script>
<style lang="less">
.lastMeetingQD-table-content {
    margin-top: 15%;
    .inspector-table-from-d{
        margin:10px;
        display: flex;
        align-items: center;
        .inspector-asterisk-v{
            color:#f5222d;
            font-size: 24px;
            display: flex;
            width: 6px;
            height: 16px;
            line-height: 21px;
        }
        .inspector-table-text{
            width: calc(50% - 20px);
            display: flex;
            align-items: center;
            justify-content: flex-end;
            .table-text-s{
                font-weight: 600;
                text-align: right;
                display: flex;
                align-items: center;
                justify-content: flex-end;
                width: 85px;
                font-size:18px;
                .inspector-asterisk-v{
                    padding-right: 13px;
                }
                .first-asterisk-v{
                    // line-height: 50px;
                }
            }
        }

        .left-text-v{

        }
        .right-content-f{
            flex: 1;
            font-size:18px;
            input {
              background: #fff;
              font-size: 26px;
            }
            .ant-input:focus {
              box-shadow: none;
            }
            .inspector-table-code-btn-box{
                height: 32px !important;
                width: 110px;
            }
            .typeCheck-div {

                // margin-bottom: 10px;
                line-height: 1.8;
            }
            .ant-form {
              .ant-row {
                margin-bottom: 0 !important;
                margin-top: 20px;
                // /deep/ input:-webkit-autofill {
                //   -webkit-box-shadow: 0 0 0 0px transparent inset !important;
                //   background-color: transparent !important;
                // }
                // input:-internal-autofill-previewed,
                // input:-internal-autofill-selected {
                //   // -webkit-text-fill-color: #FFFFFF !important;
                //   outline: none;
                //   transition: background-color 5000s ease-in-out 0s !important;
                //   background-color: transparent !important;
                // }
                // /deep/ input:-internal-autofill-selected {
                //     transition: background-color 5000s ease-in-out 0s !important;
                //     background-color: transparent !important;
                // }
              }
            }
        }
        .right-content-v{
            flex: 1;
            font-size:18px;
            .inspector-table-code-btn-box{
                height: 32px;
                width: 88px;
            }
            .typeCheck-div {

                // margin-bottom: 10px;
                line-height: 1.8;
            }
        }
        .email-suffix-v{
            display: flex;
            align-items: center;
        }


    }
    .qd-btn,.qd-btn:hover, .qd-btn:focus{
        font-size: 18px;
        height: 42px !important;
        border-radius: 21px;
        background-color: #fe8939;
        border-color: #fe8939;
        width: 80%;
    }
    .blue-btn1,.blue-btn1:hover, .blue-btn1:focus{
        font-size: 18px;
        height: 42px !important;
        border-radius: 21px;
        background-color: #5ca3e5;
        border-color: #5ca3e5;
        width: 80%;
    }
    .yqd-btn,.yqd-btn-primary:hover, .yqd-btn-primary:focus{
        background-color: #1ab348 !important;
        border-color: #1ab348 !important;
    }
  }
</style>